import React from 'react';
import '../../Chat.css';

interface UserData {
  username: string;
  image: string;
  isLoggedIn: boolean;
}

interface HeaderProps {
  currentUser: UserData;
  onShowCreateGroup: () => void;
}

const Header: React.FC<HeaderProps> = ({ currentUser, onShowCreateGroup }) => {
  return (
    <div className="chat-header">
      <div style={{ display: 'flex' }}>
        <img
          src={currentUser.image}
          className="current-user-avatar"
          //   alt={currentUser.username}
        />
        <div className="header-title">消息</div>
      </div>
      <div className="header-actions">
        <button className="action-btn call-btn" title="通话">
          📞
        </button>
        <button
          className="action-btn add-btn"
          title="新建群聊"
          onClick={onShowCreateGroup}
        >
          +
        </button>
      </div>
    </div>
  );
};

export default Header;
